
% !Mode:: "TeX:UTF-8"

\chapter{项目部署文档}

\section{项目概述}
“饿了吧V2.0”是一个全面升级的线上外卖点餐平台，旨在优化和扩展现有系统（饿了么V1.0）的功能，以更好地满足用户、商家和管理员的需求。以下是该项目的目的、功能和特点的详细分类描述：
\subsection{项目目的}
本项目旨在开发和部署“饿了吧V2.0”平台，提供一个连接消费者与本地餐馆的线上点餐和配送服务渠道。通过升级系统的用户管理、商家管理和订单管理等模块，并提高系统性能和用户体验，最终实现高质量的软件交付。该项目的目的是在提升平台整体服务能力的同时，为开发团队、测试团队和项目管理人员提供明确的需求指导。
\subsection{项目功能}
项目的核心功能包括：用户管理（支持用户注册、登录、个人信息管理和地址管理）、商家管理（支持商家注册、店铺信息和商品管理、订单处理）、点餐功能（用户可以浏览商家菜单、将商品添加至购物车并下单）、支付功能（支持通过第三方支付平台进行在线支付）、订单管理（实现订单生成、支付、配送跟踪和历史订单查询）、以及系统管理（管理员可进行用户和商家管理、订单数据管理及系统维护与监控）。
\subsection{项目特点}
项目特点是为两类用户提供服务：消费者能够便捷地在线订餐和跟踪配送，商家能够通过平台管理店铺和处理订单。
\section{系统要求}
为了在云服务器上成功部署“饿了吧V2.0”项目，以下是所需的硬件和软件要求：
\subsection{硬件要求}
\begin{itemize}
\item{服务器}: 阿里云
\item{操作系统}: CentOS 7.9
\item{CPU}: 至少2核处理器
\item{内存}: 至少 2GiB
\item{存储}: ESSD Entry云盘，至少 40GiB
\end{itemize}
\subsection{软件要求}
操作系统

CentOS 7.9: 支持系统的基础运行环境

编程语言与框架

Java 17.0.12: 用于后端服务开发

Spring Boot 3.2.1: 用于构建后端微服务应用，其他相关依赖的版本参考pom.xml文件

前端技术

Vue3: 用于构建前端用户界面

数据库

MySQL 8.0.24: 关系型数据库管理系统，用于数据存储

MySQL Workbench 8.0CE（可选，用于数据库管理）

反向代理与负载均衡

Nginx 1.24.0: 用于反向代理和负载均衡

构建与部署工具（本地）

Maven 3.8.7: 用于Java项目的构建和依赖管理

Git: 版本控制工具，用于代码管理和协作

IDE（本地）

IntelliJ IDEA 2022.2.2：方便后端项目代码的编写

WebStorm 2024.2.0.1：方便前端项目代码的编写

其他工具（本地）

Xshell：远程连接服务器进行命令行操作

Xftp：远程连接服务器进行文件传输操作

Node.js: 支持前端开发环境（与Vue配合使用）

NPM 9.6.7: 包管理工具，用于管理前端依赖

\section{部署步骤}
\subsection{环境检查}
请检查上面各种软硬件要求是否符合规范（如运行java -version检查相应的版本）
\subsection{配置服务器数据库}
可以使用mysql workbench连接服务器的数据库，点击server->data import，导入elm.sql文件，如图~\ref{fig:22}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=1\textwidth]{22}
\caption{配置服务器数据库}\label{fig:22}
\vspace{\baselineskip}
\end{figure}
\subsection{后端项目打包并上传}
\subsubsection{修改application.properties配置信息}
首先修改application.properties，要修改数据库的相关信息（用户名密码url等等），端口号可以修改（默认8080），如图~\ref{fig:27}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=1\textwidth]{27}
\caption{application.properties配置信息}\label{fig:27}
\vspace{\baselineskip}
\end{figure}
注意username是登录mysql时的用户名，password是相应的密码，url要改成对应的服务器公网ip + 端口号（默认3306），“/”后面是你要连接的数据库名称

\subsubsection{更新 WebMvcConfig 中的 CORS 配置}
然后在WebMvcConfig.java中，修改localhost的部分，允许跨域访问服务器公网ip，如图~\ref{fig:28}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=1\textwidth]{28}
\caption{localhost}\label{fig:28}
\vspace{\baselineskip}
\end{figure}

\subsubsection{项目打包}
在IDEA右侧菜单栏处找到maven，先clean，清理target目录；然后package打包，最好出现BUILD SUCCESS就是打包成功了，如图~\ref{fig:29}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=0.4\textwidth]{29}
\caption{IDEA右侧菜单栏}\label{fig:29}
\vspace{\baselineskip}
\end{figure}
\subsubsection{建立服务器相关路径}
在/www/wwwroot/目录下，建立http/目录和http/dist（用于存放前端的静态文件），如图~\ref{fig:30}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=0.4\textwidth]{30}
\caption{dist文件夹上传}\label{fig:30}
\vspace{\baselineskip}
\end{figure}
\subsubsection{项目上传至服务器}
在target目录下找到jar包，利用Xftp将jar包传输到服务器/www/wwwroot/http目录下，如图~\ref{fig:31}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=0.4\textwidth]{31}
\caption{jar包上传}\label{fig:31}
\vspace{\baselineskip}
\end{figure}
\subsection{前端项目打包并上传}
\subsubsection{修改配置信息}
在main.js中修改连接后端的地址，以便于访问后端API，对应刚刚的application.properties文件，如图~\ref{fig:32}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=1\textwidth]{32}
\caption{main.js文件}\label{fig:32}
\vspace{\baselineskip}
\end{figure}
\subsubsection{前端项目打包}
在前端项目（vue脚手架创建的）的目录下，以管理员身份打开cmd，在编译之前可以运行npm run serve进行测试，没问题后，运行npm run build。成功打包后会生成dist目录，将该目录下的文件（注意不要拷贝dist这个目录本身）通过Xftp上传到服务器的/www/wwwroot/http/dist目录下，如图~\ref{fig:33}~所示。

\begin{figure}[htbp]
\centering
\includegraphics[width=0.5\textwidth]{33}
\caption{/www/wwwroot/http/dist目录}\label{fig:33}
\vspace{\baselineskip}
\end{figure}
\subsection{配置nginx}
\subsubsection{修改配置文件}
运行\texttt{sudo vi /www/server/nginx/conf/nginx.conf}，打开nginx配置文件（注意你的目录可能不一样），在http块里面加一个server块，注意要修改\texttt{server\_name}，\texttt{root}，\texttt{proxy\_pass}这三个字段，其中的\texttt{proxy\_pass}如果是和后端部署在同一个服务器中，用\texttt{localhost}就行。
\begin{lstlisting}
    server {
        listen 80;  # 监听 HTTP 默认端口 80
        server_name 8.130.101.20;  # 替换为您的域名或服务器IP地址
    
        # 配置 Vue 前端文件的位置
        location / {
            root /www/wwwroot/http/dist;  # 替换为 Vue 项目构建后的文件路径
            try_files $uri $uri/ /index.html;
        }
    
        # 代理 Spring Boot 后端 API 请求
        location /elm/ {
            proxy_pass http://localhost:8080/elm/;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }
    }
    \end{lstlisting}
\subsubsection{重启nginx}
配置好该文件后保存，运行sudo /usr/bin/nginx -s reload，重新加载nginx（目录可能不同，可以通过which nginx或者nginx -t不仅会检查 Nginx 配置文件的语法，还会在输出中显示当前使用的配置文件路径）
\subsection{检查云服务器的安全组}
我的后端的端口是8080，数据库是3306，此外80，443等端口也要打开，如图~\ref{fig:33}~所示。
\begin{figure}[htbp]
\centering
\includegraphics[width=1\textwidth]{33}
\caption{端口情况}\label{fig:33}
\vspace{\baselineskip}
\end{figure}
\subsection{启动项目}
在/www/wwwroot/http目录下，运行java -jar elmboot-0.0.1-SNAPSHOT.jar，如果成功运行不报错，则项目成功跑起来了。如果想让项目一直在后台运行，建议使用nohup

nohup java -jar elmboot-0.0.1-SNAPSHOT.jar \&

\section{常见问题和解决方案}

\subsection{环境检查问题}
问题: java -version 显示的版本与预期不符。

解决方案: 检查系统的 Java 版本是否为 17。如果不是，请使用 yum install java-17-openjdk 进行安装或更新。

问题: MySQL 连接失败。

解决方案: 确保 MySQL 服务已启动，并且防火墙开放了 3306 端口。
\subsection{数据库导入问题}
问题: 使用 MySQL Workbench 导入数据库时报错。

解决方案: 确保 .sql 文件格式正确，且导入的数据库已存在。如果数据库不存在，先通过 CREATE DATABASE <数据库名>; 创建数据库。
\subsection{后端项目部署问题}
问题: application.properties 中的数据库连接失败。

解决方案: 确认数据库的用户名、密码和 URL 是否正确，并确保服务器的公网 IP 和端口（3306）填写无误。
\subsection{前端项目部署问题}
问题: 打包后前端无法访问后端 API。

解决方案：确保在 main.js 中正确配置了后端的 API 地址，且 Nginx 配置中的 \texttt{proxy\_pass} 字段正确指向后端服务。
\subsection{Nginx 配置问题}
解决方案: 使用 nginx -t 命令检查配置文件的语法是否正确，并确保配置路径正确。如果路径不对，可通过 which nginx 查找实际路径。
\section{备份和恢复}
\subsection{数据库备份和恢复}
备份：

使用 \texttt{mysqldump} 工具备份数据库：
\begin{lstlisting}
mysqldump -u root -p<密码> elm > backup.sql
\end{lstlisting}
建议将备份文件定期上传到云存储或其他安全位置。

恢复：

使用 MySQL Workbench 或命令行工具恢复数据库：
\begin{lstlisting}
mysql -u root -p<密码> elm < backup.sql
\end{lstlisting}
确保在恢复前数据库已经存在，否则先创建数据库。
\section{升级和维护}
\subsection{项目代码和配置更新}
\subsubsection{代码更新}
使用 Git 拉取最新代码，并确保所有依赖项已更新。

重新打包项目并上传到服务器：mvn clean package。
\subsubsection{配置更新}
更新 application.properties 等配置文件，并根据需要修改数据库连接和其他配置信息。

使用 \texttt{sudo vi} 编辑 Nginx 配置文件，更新 \texttt{server\_name} 或 \texttt{proxy\_pass} 等字段。
\subsection{升级和维护注意事项}
\subsubsection{注意事项}
备份: 在进行任何升级或维护操作前，务必先备份数据库和项目文件，以防操作失误导致数据丢失。

平滑升级: 使用 nohup工具进行后台运行，确保在更新过程中不影响系统正常运行。

版本控制: 使用 Git 管理项目代码，确保在发生问题时能够快速回滚到之前的稳定版本。
\subsubsection{升级步骤}
备份现有系统。

在测试环境中验证新版本的代码和配置。

将新版本部署到生产环境，并监控系统状态。